﻿@using MBA.FluentExt
@using MBA.FluentExt.Ext

<script type="text/javascript">
	function btnSomething_Render(button)
	{
		setTimeout(function ()
		{
			button.setText("Changed after 3 seconds");
		}, 3000);
	}
</script>

@X.ExtScript( // Render the following components as a var <id>=new <ctor>(<config>); inside a <script> tag
	X.Button("btnSomething") // We are creating a button with id = btnSomething
		.Text("MyButton") // This will be the button text
		.ToAdvanced() // For some not-so-common config options, we toggle to advanced mode (you can revert this back using .ToBasic()). Notice that this exists only for a simplified intellisense. Both basic and advanced components are the same ExtJS Button.
		.Scale(ButtonScale.Large) // An advanced config option to set the button scale
		.RenderTo("divContainer") // Render this button to a element named divContainer
		.ToBasic() // We can revert to basic button =)
		.Listeners( // and add some javascript listeners
			Listener.On(
				Button.Click, // On click...
				Raw.Script("function(){alert('Button click!')}") // ..do something amazing
			),
			Listener.On(
				AdvancedButton.Render, // Advanced events also exists
				Raw.Function("btnSomething_Render") // this time we just call a simple javascript function
			)
		)
	)

<div id="divContainer"></div>